<template>
  <div class="mine">
      <Navbar>
        <div class="nav">
          <h3>{{title}}</h3>
        </div>
      </Navbar>
      <component :is="mycomponent" @cui="ff"></component>
      <Tabbars></Tabbars>
      
  </div>
</template>
<script>
import Tabbars from '../components/Tabbars.vue';
import Myform from '../components/Myform.vue';
import Mymine from '../components/Mymine.vue';
import Navbar from "../components/Navbar.vue"

export default {
  
  components: {Tabbars,Myform,Mymine,Navbar},
    data() {
    return {
      mycomponent:"Myform",
      arr:["Myform","Mymine"],
      title:"登录"
    };
  },
  methods:{
    ff(v){
      //登录成功后更新页面内容
      this.mycomponent = v
      this.title = "个人中心"
    }
  },
  name: "Mine",
  created(){
    //检查用户是否登录
    let token = localStorage.getItem("token")
    if(token){
      this.mycomponent = "Mymine"
      this.title = "个人中心"
    }else{
      this.mycomponent = "Myform"
    }
  },
};
</script>
<style lang="less" scoped>
*{
  padding: 0;
  margin: 0;
}
  .mine .nav{
    background: @primary;
    width: 100%;
    text-align: center;
    height: 50px;
    line-height: 50px;
    margin-bottom: 20px;
  }
</style>